<template>
	<header class="header">
		<h1>todos</h1>
		<input id="toggle-all" class="toggle-all" type="checkbox" v-model="pitch">
		<label for="toggle-all"></label>
		<input class="new-todo" placeholder="输入任务名称-回车确认" autofocus v-model.trim="content" @keyup.enter="add"/>
	</header>
</template>

<script>
	export default {
		data() {
			return {
				content: '',
			}
		},
		props: {
			arr: {
				type: Array,
				required: true
			},
		},
		computed: {
			pitch: {
				set(val) {
					this.arr.forEach(item => item.isDone = val);
				},
				get() {
					return this.arr.every(item => item.isDone === true)
				}
			}
		},
		methods: {
			//输入框添加功能
			add() {
				if (this.content.length === 0) {
					return
				}
				this.$emit('add',this.content)
				this.content = ''
			},
			// checkAll(sele) {
			// 	this.$emit('checkAll',sele)
			
			// }
	}
	}
</script>
